/*
* 魔方模板 混入
* */
import cloneDeep from 'lodash.clonedeep'

const TemplateMixin = {
  props: {
    imageGutter: {
      type: Number,
      default: 0
    },
    pageGutter: {
      type: Number,
      default: 0
    },
    list: {
      type: Array,
      default: () => []
    },
    preview: {
      type: Boolean,
      default: false
    },
    len: {
      type: Number,
      default: 2
    }
  },
  computed: {
    images () {
      const { list, len } = this
      return list.filter((item, index) => index < len).map(item => item.imgUrl)
    }
  },
  data () {
    return {
      selected: 0
    }
  },
  methods: {
    handleClick (index) {
      this.selected = index
      this.$emit('change', { selected: index })
    }
  },
  mounted () {
    const { list, len } = this
    const listCopy = cloneDeep(list)
    if (listCopy.length < len) {
      for (let i = 0; i < len; i++) {
        if (listCopy[i]) {
          continue
        }
        listCopy.push({
          imgUrl: ''
        })
      }
      this.$emit('change', { cubes: listCopy })
    }
  }
}

export default TemplateMixin
